<template>
  <el-date-picker
    clearable
    placeholder="请选择"
    :disabled="disabled"
    :type="type"
    class="width_100 height_auto"
    :format="TimeFormat"
    :default-time="DefaultTime"
    v-model="state"
    @change="change"
    :disabled-date="disabledDateFun"
  />
</template>

<script setup lang="ts">
  /**
   * @props
   */

  const props = defineProps({
    // 值
    value: {
      type: String,
      default: '',
    },
    // 禁用状态
    disabled: {
      type: Boolean,
      default: false,
    },
    // 类型
    type: {
      type: String,
      default: 'datetimerange', // year/month/date/dates/datetime/ week/datetimerange/daterange/ monthrange
    } as any,
    // 禁用日期范围[默认不禁用]
    disabledDateFun: {
      type: Function,
      default: () => {
        return false
      },
    },
  })

  /**
   * @var
   */

  const state = toRef(props.value)
  const DefaultTime: [Date, Date] = [
    new Date(2000, 1, 1, 0, 0, 0),
    new Date(2000, 2, 1, 23, 59, 59),
  ]
  // 默认
  const TimeFormat = 'YYYY-MM-DD HH:mm:ss'
  /**
   * @method
   */
  const emit = defineEmits(['change'])
  const change = (value: any) => {
    emit('change', value)
  }

  // const disabledDateFun = (time: Record<string, any>): boolean => {
  //     if (time.getTime() > new Date(DefaultTime[1]).getTime()) {
  //         return true;
  //     } else {
  //         return false;
  //     }
  // }
</script>

<style scoped></style>
